{% extends 'layout.html' %}
{% load permission %}
{% load static %}

{% block content %}
    <div style="margin-bottom: 5px" class="clearfix">

        {% add_permission request 'customer_add' %}

        <div style="float: right">
            <form class="form-inline" method="get">
                <div class="form-group">
                    <input name="keyword" type="text" class="form-control" placeholder="请输入关键字" value="{{ keyword }}">
                </div>
                <button type="submit" class="btn btn-default">
                    <span class="glyphicon glyphicon-search"></span>
                </button>
            </form>
        </div>
    </div>
    <table class="table table-bordered">
        <thead>
        <tr>
            <th>ID</th>
            <th>用户名</th>
            <th>手机号</th>
            <th>余额</th>
            <th>级别</th>
            <th>注册时间</th>
            <th>交易记录</th>
            <th>重置密码</th>
            {% if request|check_permission:"customer_edit,customer_delete" %}
                <th>操作</th>
            {% endif %}

        </tr>
        </thead>
        <tbody>
        {% for row in queryset %}
            <tr row-id={{ row.id }}>
                <td>{{ row.id }}</td>
                <td>{{ row.username }}</td>
                <td>{{ row.mobile }}</td>
                <td>{{ row.balance }}</td>
                <td>{{ row.level.title }} ({{ row.level.percent }}%)</td>
                <td>{{ row.create_date | date:"Y-m-d H:i:s" }}</td>
                <td><a href="{% url 'customer_charge' row.id %}">交易记录</a></td>
                <td><a href="{% url 'customer_reset' row.id %}">重置密码</a></td>

                {% if request|check_permission:"customer_edit,customer_delete" %}
                    <td>
                        <!-- 通过  simple_tag 控制生成 -->
                        {% edit_permission request 'customer_edit' row.id %}

                        <!-- 原本区域 编辑按钮  的逻辑
                     <a href="{% url 'customer_edit' row.id %}" class="btn btn-primary btn-xs">编辑</a>
                     -->

                        {% delete_permission request 'customer_delete' pk=row.id %}
                        <!--  原本区域 删除按钮  的逻辑
                    <a cid={{ row.id }} href="" class="btn btn-danger btn-xs btn-delete">删除</a>
                    -->

                    </td>
                {% endif %}
            </tr>
        {% endfor %}
        </tbody>
    </table>

    <!-- 分页区域 -->
    <ul class="pagination">
        {{ page_string }}
    </ul>

    <!-- Modal 弹出告警提示 -->
    {% include 'include/delete_modal.html' %}

{% endblock %}

{% block js %}
    <script src="{% static 'js/delete_modal.js' %}"></script>
    <script>
        let DELETE_ID
        let DELETE_URL = "{%  url 'customer_delete' %}"
    </script>
{% endblock %}